@charset "UTF-8";
@import "../common/scss/mobile";
@import "../common/scss/mixins";
@import "../common/scss/sprites";
body{
	background-color:$bg02;
	height:100%;
}
.searchcard{
		.icon-unbind{
			@include mix-unbind();
		}
	.card-item{
		padding:0 1.4rem;
		font-size:$fs11;
		background-color:$bg00;		
		position:relative;
		margin-bottom:1.4rem;
		.item-row{
			@extend .flex-row;
			height:3.6rem;
			.validuntil,.cardnumber{
				@extend .flex-item;
			}
			.cardnumber,.balances,.unbind-icon,.validuntil{
				align-self:center;
			}
			.validuntil{
				color:$color02;
			}
			.cardnumber{
				font-size:$fs15;
				color:$color01;
			}
			.balances{
				color:$color05;
				font-size:$fs17;
				sub{
					font-size:$fs11;
				}
				.label{
					font-size:$fs10;
					margin-right:0.8rem;
				}
			}
             
		}
		&.card-item-expired{
			background-color:$bg02;
			.item-row{
				.balances{color:$color02;}
			}
		}
		.card-btn{
			padding-bottom:1.4rem;
			text-align:right;
			button{
				font-size:$fs15;
				width:7.8rem;
				margin-left:1rem;
				@include inline-block;
				@include radius(0.4rem);
				padding:0.4rem 0;
				&.button-gray{
					border:1.5px solid $border01;
					color:$color01;
					background-color: transparent;
				}
				&.button-green{
					border:1.5px solid $bg04;
					background-color:$bg04;
					color:$color10;
					
				}
			}
		}
	}
	.expired-mark{
		position:absolute;
		left:0;
		bottom:0;
		.icon-expired{
			@include mix-expired();
		}
	}
 

}
.add-card{
    .icon-add{
		@include mix-add();
		vertical-align: baseline;
	}
	button{
		@include green-button(false);
		line-height: 4.9rem;
		font-size: $fs18;
	}

}
@import "../common/scss/layer";